﻿@model  List<检查页面开放.Models.Model>
@using Mysoft.Utility;
@using 检查页面开放.Models

@{
    ViewBag.Title = "YunCeIndex";
    List<AllAppDataSource> allAppDataSources = ViewBag.AllAppDataSources;

    Layout = null;
}
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/vue.js"></script>
<style>
    select {
        min-width: 100px;
    }

    table {
        border-collapse: collapse;
        border: 1px solid black;
    }

    th, td {
        border: 1px solid black;
    }

    .spanModel {
        font: bold;
        padding-left: 20px;
    }

    body {
        font-size: 14px;
    }

    .green {
        background-color: green;
    }

    .red {
        background-color: palevioletred;
    }
</style>
<div>
    <div>
        系统：<select id="opApp" style="width: 300px;">
            <option value=""></option>
            @{
                foreach (var app in allAppDataSources)
                {

                    <option value="@app.Code">@app.Name</option>
                }
            }
        </select>
        <button onclick="check(this)">检查</button>
    </div>
</div>

<div id="MethodVue">
    <h3>整体</h3>
    <table>
        <thead><tr><td>说明</td><td>接口数</td><td>覆盖个数</td><td>覆盖率</td></tr></thead>
        <tbody>
            <tr v-for="md in InterFaceResults">
                <td>{{md.Remark}}</td>
                <td>{{md.Count}}</td>
                <td>{{md.YcCount}}</td>
                <td>{{md.Fgl}}</td>
                
                <td>
                    <span style="cursor:pointer;" v-on:click="modelDisplay($event)" ref="disSpan">折叠/展开</span>
                    <div style="display:none;">
                        <table>
                            <thead><tr> <th>类.方法</th> <th>是否覆盖</th> <th>是否对外</th> </tr></thead>
                            <tbody>
                                <tr v-for="d in md.MethodList" v-bind:class="{green:d.YCIsCover,red:d.YCIsCover!=true}">
                                    <td>{{d.ClassFullName}}.{{d.MethodName}}</td>
                                    <td v-if="d.YCIsCover==true">已覆盖</td>
                                    <td v-if="d.YCIsCover!=true">未覆盖</td>
                                    <td v-if="d.IsOpen==true">对外</td>
                                    <td v-if="d.IsOpen!=true">对内</td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </td>
                
            </tr>
        </tbody>
    </table>


    <h3>按模块</h3>
    <div>
        <div v-for="md in Models">
            <div>
                <span style="cursor:pointer;" v-on:click="modelDisplay($event)" ref="disSpan">折叠/展开</span>
                <span class='spanModel'>
                    模块:{{md.Name}}
                    总数:{{  Object.keys(md.MethodList).length}}
                    已覆盖:{{ coverCount(md) }}
                    未覆盖:{{ noCoverCount(md)}}
                </span>
                <div style="display:none;">
                    <table>
                        <thead><tr> <th>类.方法</th> <th>是否覆盖</th> <th>是否对外</th> </tr></thead>
                        <tbody>
                            <tr v-for="d in md.MethodList" v-bind:class="{green:d.YCIsCover,red:d.YCIsCover!=true}">
                                <td>{{d.ClassFullName}}.{{d.MethodName}}</td>
                                <td v-if="d.YCIsCover==true">已覆盖</td>
                                <td v-if="d.YCIsCover!=true">未覆盖</td>
                                <td v-if="d.IsOpen==true">对外</td>
                                <td v-if="d.IsOpen!=true">对内</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

</div>
<script>

   var vueData = new Vue({
       el: '#MethodVue',
       data: {
           Models: [],
           InterFaceResults:[]
       },
       computed: {
       },
       methods: {
           modelDisplay: function(e) {
               var $this = $(e.currentTarget);
               $this.nextAll("div").toggle();
           },
           coverCount: function(md) {
               var count = 0;
               for (var i = 0; i < md.MethodList.length; i++) {
                   if (md.MethodList[i].YCIsCover == true) {
                       count++;
                   }
               }
               return count;
           },
           noCoverCount: function(md) {
               var count = 0;
               for (var i = 0; i < md.MethodList.length; i++) {
                   if (md.MethodList[i].YCIsCover != true) {
                       count++;
                   }
               }
               return count;
           }
       }
   });

   function check(obj) {
       var selOpp = $("#opApp option:selected");
       var selCode = selOpp.val();
       if (selCode == "") {
           alert("请选择系统！");
           return;
       }
       var $obj = $(obj);
       $obj.attr("disabled", "disabled");
       $.ajax({
           url: '@Url.Content("GetYc")',
           data: "modelCode=" + selCode ,
           dataType:"json",
           success: function (re) {
               vueData.Models = re.Models;
               vueData.InterFaceResults = re.InterFaceResults;
           },
           error: function (a, b, c) {
               alert(a.responseText);
           },
           complete:function() {
               $obj.removeAttr("disabled");
           }
       });
   }
</script>
